// 封装axios 请求模块

import axios from "axios"
import store from "@/store"

// axios.create({}) 创建一个新的axios对象，在企业开发中可能会请求多个服务器后台，就需要设置多个基准路径
const request = axios.create({
    baseURL: "http://toutiao-app.itheima.net/" // 设置基准路径
})

// 请求拦截器
request.interceptors.request.use(function(config) {
    // 请求发起会经过这里
    // config：本次请求的请求配置对象
    const { user } = store.state
    if (user && user.token) {
        config.headers.Authorization = `Bearer ${user.token}`
    }

    // 注意：这里务必要返回 config 配置对象，否则请求就停在这里出不去了
    return config
}, function(error) {
    // 如果请求出错了（还没有发出去）会进入这里
    return Promise.reject(error)
})

// 响应拦截器
request.interceptors.response.use(
    // 第一个函数就是正常响应的时候要调用的函数
    function(response) {
        return response
    },
    // 第二个函数时候响应出错的时候会执行的函数
    async function(error) {
        // console.dir(error)
        // // 只需要处理token过期的401问题，所以我们必须判断这一种情况再做处理
        // if (error.response && error.response.status === 401) {
        //   // 如果401了，应该利用refresh_token去重新获取一个最新的token
        //   // 在接口文档中，有一个接口可以帮助我们做这个事情

        //   // 问题：如果想要发送请求，还是使用request对象来发请求，
        //   // 又会使用咱们之前的请求拦截器并且发送一个过期错误的token
        //   // 解决方案：重新创建一个axios实例对象来发请求就好了
        //   const newAxios = axios.create({
        //     baseURL: 'http://localhost:8000'
        //   })

        //   // 获取refresh_token
        //   const { user } = store.state

        //   const res = await newAxios({
        //     url: '/v1_0/authorizations',
        //     method: 'PUT',
        //     headers: {
        //       Authorization: 'Bearer ' + user.refresh_token
        //     }
        //   })

        //   // console.log(res)
        //   // 1. 将最新的token重新保存到Vuex
        //   store.commit('setUser', { token: res.data.token, refresh_token: user.refresh_token })
        //   // 2. 使用最新的token重新发送一次之前报错的请求，那么利用出错的请求配置对象重新发送一次请求就好了
        //   return request(error.config)
        // }
        // // return error

        // return Promise.reject(error)
        // console.log('response')
        // // 函数的形参error就是 响应时报的错误
        // // 下面的if判断就是判断 错误的状态码是不是 401，如果是401代表就是token过期了
        if (error.response && error.response.status === 401) {
            // 获取到Vuex中保存的user用户数据，在user用户数据中包含了过期的token，和refresh_token
            const user = store.state.user
                // 如果user不存在，或者user里面没有refresh_token
            if (!user || !user.refresh_token) {
                // 跳转到登录页面
                router.push('/login')
                return false
            }
            // 执行try...catch
            try {
                // 当我们请求刷新用户token的接口之后，接口返回的数据中就包含了 最新的token
                const res = await axios({
                    method: 'PUT',
                    url: 'http://toutiao-app.itheima.net/v1_0/authorizations',
                    headers: {
                        Authorization: `Bearer ${user.refresh_token}`
                    }
                })
                console.log(res)
                    // 将最新的token和refresh_token保存到Vuex中，
                store.commit('setUser', { token: res.data.data.token, refresh_token: user.refresh_token })
                    // request( {url: method: }  )
                    // error.config就是之前发生错误的那次请求的配置对象
                    // 按照之前错误的那次请求的配置，重新请求一次
                return request(error.config)
            } catch (error) {
                router.push('/login')
            }
        }
        return Promise.reject(error)
    }
)


export default request